<!--  -->
<template>
  <div class="__layout-content-container">
    <router-view />
  </div>
</template>

<script setup lang="ts"></script>

<style lang="scss" scoped>
.__layout-content-container {
  /* 右侧内容占据剩余所有宽度 */
  flex: 1;
  padding: 16px;
  overflow-y: auto; /* 内容过多时可垂直滚动 */
  transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* 与侧边栏同步的过渡动画 */

  /* 当侧边栏收起时，调整内容区左边距以适应 */
  :deep(.__layout-aside.collapsed) + & {
    margin-left: 0;
  }
}
</style>
